<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="css/layui.css">
</head>
<body class="layui-layout-body">
<div class="layui-layout layui-layout-admin">
    <div class="layui-header">
        <div class="layui-logo"><a href="#" class="logo">layui后台管理</a></div>
        <!-- 头部区域（可配合layui已有的水平导航） -->
        <ul class="layui-nav layui-layout-left">
            <li><a href="javascript:;" class="iconfont hideMenu icon-menu1"></a></li>
            <li>
                <div class="layui-form component">
                    <select name="modules" lay-verify="required" lay-search="">
                        <option value="">直接选择或搜索选择</option>
                        <option value="1">layer</option>
                        <option value="2">form</option>
                        <option value="3">layim</option>
                        <option value="4">element</option>
                        <option value="5">laytpl</option>
                        <option value="6">upload</option>
                        <option value="7">laydate</option>
                        <option value="8">laypage</option>
                        <option value="9">flow</option>
                        <option value="10">util</option>
                        <option value="11">code</option>
                        <option value="12">tree</option>
                        <option value="13">layedit</option>
                        <option value="14">nav</option>
                        <option value="15">tab</option>
                        <option value="16">table</option>
                        <option value="17">select</option>
                        <option value="18">checkbox</option>
                        <option value="19">switch</option>
                        <option value="20">radio</option>
                    </select>
                    <div class="layui-form-select">
                        <div class="layui-select-title"><input type="text" placeholder="请选择" value="layer"
                                                               class="layui-input"><i class="layui-edge"></i></div>
                        <dl class="layui-anim layui-anim-upbit" style="">
                            <dd lay-value="1" class="layui-this">layer</dd>
                            <dd lay-value="2" class="">form</dd>
                            <dd lay-value="3" class="">layim</dd>
                            <dd lay-value="4" class="">element</dd>
                            <dd lay-value="5" class="">laytpl</dd>
                            <dd lay-value="6" class="">upload</dd>
                            <dd lay-value="7" class="">laydate</dd>
                            <dd lay-value="8" class="">laypage</dd>
                            <dd lay-value="9" class="">flow</dd>
                            <dd lay-value="10" class="">util</dd>
                            <dd lay-value="11" class="">code</dd>
                            <dd lay-value="12" class="">tree</dd>
                            <dd lay-value="13" class="">layedit</dd>
                            <dd lay-value="14" class="">nav</dd>
                            <dd lay-value="15" class="">tab</dd>
                            <dd lay-value="16" class="">table</dd>
                            <dd lay-value="17" class="">select</dd>
                            <dd lay-value="18" class="">checkbox</dd>
                            <dd lay-value="19" class="">switch</dd>
                            <dd lay-value="20" class="">radio</dd>
                        </dl>
                    </div>

                    <i class="layui-icon"></i>
                </div>
            </li>
            <li>
                <div class="weather" pc="">
                    <div id="tp-weather-widget">
                        <div class="tpwthwidt" data-reactid=".0">
                            <div class="cover_1fRJ83H container_aaK_vMn" data-reactid=".0.0">
                                <div class="tpwidget_title_hook title_2I35arv" style="color:#FFFFFF;"
                                     data-reactid=".0.0.0">杭州
                                </div>
                                <div class="tpwidget_icon_hook icon_2vazXGH iconSmall_2z-CFEN icon0_1p11pIJ"
                                     data-reactid=".0.0.1"></div>
                                <div class="tpwidget_text_hook text_1vUR5ag" style="color:#FFFFFF;"
                                     data-reactid=".0.0.2">20°
                                </div>
                                <div class="tpwidget_alarm_hook coverAlarmPane_2o92LQm" data-reactid=".0.0.3">
                                    <div data-reactid=".0.0.3.0"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <script src="//widget.seniverse.com/widget/chameleon.js" charset="utf-8" async=""></script>
                    <script>(function (T, h, i, n, k, P, a, g, e) {
                        g = function () {
                            P = h.createElement(i);
                            a = h.getElementsByTagName(i)[0];
                            P.src = k;
                            P.charset = "utf-8";
                            P.async = 1;
                            a.parentNode.insertBefore(P, a)
                        };
                        T["ThinkPageWeatherWidgetObject"] = n;
                        T[n] || (T[n] = function () {
                            (T[n].q = T[n].q || []).push(arguments)
                        });
                        T[n].l = +new Date();
                        if (T.attachEvent) {
                            T.attachEvent("onload", g)
                        } else {
                            T.addEventListener("load", g, false)
                        }
                    }(window, document, "script", "tpwidget", "//widget.seniverse.com/widget/chameleon.js"))</script>
                    <script>tpwidget("init", {
                        "flavor": "slim",
                        "location": "WX4FBXXFKE4F",
                        "geolocation": "enabled",
                        "language": "zh-chs",
                        "unit": "c",
                        "theme": "chameleon",
                        "container": "tp-weather-widget",
                        "bubble": "disabled",
                        "alarmType": "badge",
                        "color": "#FFFFFF",
                        "uid": "U9EC08A15F",
                        "hash": "039da28f5581f4bcb5c799fb4cdfb673"
                    });
                    tpwidget("show");</script>
                </div>
            </li>

            <span class="layui-nav-bar" style="width: 0px; left: 0px; opacity: 0;"></span></ul>

        <ul class="layui-nav layui-layout-right">
            <li class="layui-nav-item showNotice" id="showNotice" pc="">
                <a href=""><i class="iconfont icon-gonggao"></i><cite>系统公告</cite></a>
            </li>

            <li class="layui-nav-item lockcms" pc="">
                <a href=""><i class="iconfont icon-lock1"></i><cite>锁屏</cite></a>
            </li>

            <li class="layui-nav-item">
                <a href="">
                    <img src="images/face.jpg" class="layui-nav-img">
                    请叫我马哥
                    <span class="layui-nav-more"></span></a>
                <dl class="layui-nav-child">
                    <dd><a href="">基本资料</a></dd>
                    <dd><a href="">安全设置</a></dd>
                </dl>
            </li>

            <span class="layui-nav-bar"></span></ul>
    </div>

    <div class="layui-side layui-bg-black">
        <div class="user-photo">
            <a class="img" title="我的头像"><img src="images/face.jpg"></a>
            <p>你好！<span class="userName">请叫我马哥</span>, 欢迎登录</p>
        </div>
        <div class="navBar layui-side-scroll" style="height: 300px;">
            <ul class="layui-nav layui-nav-tree">
                <li class="layui-nav-item layui-this"><a href="javascript:;" data-url=""><i
                        class="iconfont icon-computer" data-icon="icon-computer"></i><cite>后台首页</cite></a></li>
                <li class="layui-nav-item"><a href="javascript:;" data-url="page/news/newsList.html"><i
                        class="iconfont icon-text" data-icon="icon-text"></i><cite>文章列表</cite></a></li>
                <li class="layui-nav-item"><a href="javascript:;" data-url="page/links/linksList.html"><i
                        class="layui-icon" data-icon=""></i><cite>友情链接</cite></a></li>
                <li class="layui-nav-item"><a href="javascript:;"
                                              data-url="\"><i class="layui-icon"
                                                              data-icon=""></i><cite>系统基本参数</cite></a>
                </li>
                <li class="layui-nav-item"><a href="javascript:;"><i class="layui-icon"
                                                                     data-icon=""></i><cite>其他页面</cite><span
                        class="layui-nav-more"></span></a>
                    <dl class="layui-nav-child">
                        <dd><a href="javascript:;" data-url=""><i class="layui-icon"
                                                                               data-icon=""></i><cite>404页面</cite></a>
                        </dd>
                        <dd><a href="javascript:;" data-url="page/login/login.html" target="_blank"><i
                                class="layui-icon" data-icon=""></i><cite>登录</cite></a></dd>
                    </dl>
                </li>
                <span class="layui-nav-bar" style="top: 22.5px; height: 0px; opacity: 0;"></span></ul>
        </div>
    </div>
</div>
<div style="width: 100%;background: #1AA094;height: 5px; "></div>
<div class="layui-body">
    <!-- 内容主体区域 -->
    <div style="padding: 15px 0;">
        <div class="layui-tab marg0" lay-filter="bodyTab" id="top_tabs_box">
            <ul class="layui-tab-title top_tab" id="top_tabs">
                <li class="layui-this" lay-id=""><i class="iconfont icon-computer"></i> <cite>后台首页</cite></li>
            </ul>
            <ul class="layui-nav closeBox">
                <li class="layui-nav-item">
                    <a href="javascript:;"><i class="iconfont icon-caozuo"></i> 页面操作<span class="layui-nav-more"></span></a>
                    <dl class="layui-nav-child layui-anim layui-anim-upbit">
                        <dd><a href="" class="refresh refreshThis"><i class="layui-icon">ဂ</i> 刷新当前</a></dd>
                        <dd><a href="" class="closePageOther"><i class="iconfont icon-prohibit"></i> 关闭其他</a></dd>
                        <dd><a href="" class="closePageAll"><i class="iconfont icon-guanbi"></i> 关闭全部</a></dd>
                    </dl>
                </li>
        </div>


        <div class="layui-row layui-col-space10">
            <div class="panel_box row">
                <div class="panel col">
                    <a href="javascript:;" data-url="">
                        <div class="panel_icon">
                            <i class="layui-icon zhuan" data-icon=""></i>
                        </div>
                        <div class="panel_word newMessage">
                            <span>5</span>
                            <cite>新消息</cite>
                        </div>
                    </a>
                </div>
                <div class="panel col">
                    <a href="javascript:;" data-url="">
                        <div class="panel_icon" style="background-color:#FF5722;">
                            <i class="layui-icon zhuan" data-icon=""></i>
                        </div>
                        <div class="panel_word userAll">
                            <span>3</span>
                            <cite>新增人数</cite>
                        </div>
                    </a>
                </div>
                <div class="panel col">
                    <a href="javascript:;" data-url="">
                        <div class="panel_icon" style="background-color:#009688;">
                            <i class="layui-icon zhuan" data-icon=""></i>
                        </div>
                        <div class="panel_word userAll">
                            <span>3</span>
                            <cite>用户总数</cite>
                        </div>
                    </a>
                </div>
                <div class="panel col">
                    <a href="javascript:;" data-url="">
                        <div class="panel_icon" style="background-color:#5FB878;">
                            <i class="layui-icon zhuan" data-icon=""></i>
                        </div>
                        <div class="panel_word imgAll">
                            <span>31</span>
                            <cite>图片总数</cite>
                        </div>
                    </a>
                </div>
                <div class="panel col">
                    <a href="javascript:;" data-url="">
                        <div class="panel_icon" style="background-color:#F7B824;">
                            <i class="layui-icon zhuan" data-icon=""></i>
                        </div>
                        <div class="panel_word waitNews">
                            <span>13</span>
                            <cite>待审核文章</cite>
                        </div>
                    </a>
                </div>
                <div class="panel col max_panel">
                    <a href="javascript:;" data-url="">
                        <div class="panel_icon" style="background-color:#2F4056;">
                            <i class="layui-icon zhuan" data-icon=""></i>
                        </div>
                        <div class="panel_word allNews">
                            <span>30</span>
                            <cite>文章总数</cite>
                        </div>
                    </a>
                </div>
            </div>
        </div>
        <blockquote class="layui-elem-quote explain">
            <p>本模板基于Layui 1.0.9实现，支持除LayIM外所有的Layui组件。<a href="http://layim.layui.com/" target="_blank"
                                                         class="layui-btn layui-btn-mini">前往获取LayIM授权</a><a
                    href="https://git.oschina.net/layuicms/layuicms" target="_blank"
                    class="layui-btn layui-btn-mini layui-btn-danger">码云下载</a><a
                    href="https://github.com/BrotherMa/layuiCMS" target="_blank"
                    class="layui-btn layui-btn-mini layui-btn-danger">GitHub下载</a>　<span style="color:#1E9FFF;">郑重提示：网站所有数据均为静态数据，无数据库，除打开的窗口和部分小改动外所有操作刷新后无效，关闭窗口或清除缓存后，所有操作无效，请知悉</span>
            </p>
            <p>开发文档地址：<a class="layui-btn layui-btn-mini" target="_blank" href="http://www.layui.com/doc">点此跳转</a> <a
                    class="layui-btn layui-btn-mini layui-btn-danger" target="_blank"
                    href="http://fly.layui.com/case/u/3198216">我要点赞</a>　<span style="color:#f00;">注：本框架未引入任何第三方组件（天气信息除外），单纯的layui+js实现的各种功能【本框架仅作为学习交流使用，如需用作商业用途，请联系作者授权，谢谢】</span>
            </p>
            <p>技术交流QQ群：<a target="_blank"
                          href="//shang.qq.com/wpa/qunwpa?idkey=8b7dd3ea73528c1e46c5d4e522426d60deed355caefdf481c1eacdd1b7b73bfd"><img
                    border="0" src="//pub.idqqimg.com/wpa/images/group.png" alt="layui后台管理模版cms" title="layuicms后台管理模版"></a>（添加时请注明来自本框架）【layuicms
                2.0正在加速开发中】</p>
        </blockquote>
        <div class="row">
            <div class="sysNotice col">
                <blockquote class="layui-elem-quote title">更新日志</blockquote>
                <div class="layui-elem-quote layui-quote-nm">
                    <h3># v1.0.1（优化） - 2017-06-25</h3>
                    <p>* 修改刚进入页面无任何操作时按回车键提示“请输入解锁密码！”</p>
                    <p>* 优化关闭弹窗按钮的提示信息位置问题【可能是因为加载速度的原因，造成这个问题，所以将提示信息做了一个延时】</p>
                    <p>* “个人资料”提供修改功能</p>
                    <p>* 顶部天气信息自动判断位置【忘记之前是怎么想的做成北京的了，可能是我在大首都吧，哈哈。。。】</p>
                    <p>* 优化“用户列表”无法查询到新添加的用户【竟然是因为我把key值写错了，该死。。。】</p>
                    <p>* 将左侧菜单做成json方式调用，而不是js调用，方便开发使用。同时添加了参数配置和非窗口模式打开的判断，【如登录页面】</p>
                    <p>* 优化部分页面样式问题</p>
                    <p>* 优化添加窗时如果导航不存在图标无法添加成功</p>
                    <br>
                    <p># v1.0.1（新增） - 2017-07-05</p>
                    <p>* 增加“用户列表”批量删除功能【可能当时忘记添加了吧。。。】</p>
                    <p style="color:#f00;">* 顶部窗口导航添加“关闭其他”、“关闭全部”功能，同时修改菜单窗口过多的展示效果【在此感谢larryCMS给予的启发】</p>
                    <p>* 添加可隐藏左侧菜单功能【之前考虑没必要添加，但是很多朋友要求加上，那就加上吧，嘿嘿。。。】</p>
                    <p>*
                        增加换肤功能【之前就想添加的，但是一直没有找到好的方式（好吧，其实是我忘记了），此方法相对简单，不是普遍适用，只简单的做个功能，如果实际用到建议单独写一套样式，将边框颜色、按钮颜色等统一调整，此处为保证代码的简洁性，只做简单的功能，不做赘述，另外“自定义”颜色中未做校验，所以要写入正确的色值。如“#f00”】</p>
                    <p style="color:#f00;">* 增加登录页面【背景视频仅作样式参考，实际使用中请自行更换为其他视频或图片，否则造成的任何问题使用者本人承担。】</p>
                    <p>* 新增打开窗口的动画效果</p>
                </div>
            </div>
            <div class="sysNotice col">
                <blockquote class="layui-elem-quote title">系统基本参数</blockquote>
                <table class="layui-table">
                    <colgroup>
                        <col width="150">
                        <col>
                    </colgroup>
                    <tbody>
                    <tr>
                        <td>当前版本</td>
                        <td class="version">v1.0.1</td>
                    </tr>
                    <tr>
                        <td>开发作者</td>
                        <td class="author">请叫我马哥</td>
                    </tr>
                    <tr>
                        <td>网站首页</td>
                        <td class="homePage">page/index.html</td>
                    </tr>
                    <tr>
                        <td>服务器环境</td>
                        <td class="server">windows</td>
                    </tr>
                    <tr>
                        <td>数据库版本</td>
                        <td class="dataBase">8.00.2039</td>
                    </tr>
                    <tr>
                        <td>最大上传限制</td>
                        <td class="maxUpload">2M</td>
                    </tr>
                    <tr>
                        <td>当前用户权限</td>
                        <td class="userRights">总管理员</td>
                    </tr>
                    </tbody>
                </table>
                <blockquote class="layui-elem-quote title">最新文章<i class="iconfont icon-new1"></i></blockquote>
                <table class="layui-table" lay-skin="line">
                    <colgroup>
                        <col>
                        <col width="110">
                    </colgroup>
                    <tbody class="hot_news">
                    <tr>
                        <td align="left">css3用transition实现边框动画效果</td>
                        <td>2017-04-14</td>
                    </tr>
                    <tr>
                        <td align="left">自定义的模块名称可以包含/吗</td>
                        <td>2017-04-14</td>
                    </tr>
                    <tr>
                        <td align="left">layui.tree如何ajax加载二级菜单</td>
                        <td>2017-04-14</td>
                    </tr>
                    <tr>
                        <td align="left">layui.upload如何带参数？像jq的data:{}那样</td>
                        <td>2017-04-14</td>
                    </tr>
                    <tr>
                        <td align="left">表单元素长度应该怎么调整才美观</td>
                        <td>2017-04-14</td>
                    </tr>
                    </tbody>
                </table>
            </div>
        </div>

        <div class="layui-footer footer">
            <p>copyright @2017 请叫我马哥　　<a onclick="donation()"
                                         class="layui-btn layui-btn-danger layui-btn-small">捐赠作者</a></p>
        </div>
    </div>


    <script src="layui.all.js"></script>

</body>
</html>